<template>
  <div>
    <el-row :gutter="20">
      <el-col>
        <el-card>
          <echaer></echaer>
        </el-card>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="18">
        <el-card>
          <div slot="header">
            <h2>动态</h2>
          </div>
          <wenzi></wenzi>
        </el-card>
      </el-col>
      <el-col :span="6">
        <el-row>
          <el-col>
            <el-card>
              <ranking></ranking>
            </el-card>
          </el-col>
        </el-row>
      </el-col>
    </el-row>
  </div>
</template>
<script>
    import echaer from './echaer.vue'
    import ranking from './Ranking.vue'
    import wenzi from './wenzi.vue'
    export default {
        components: {
            echaer,
            ranking,
            wenzi
        }
    };
</script>
<style lang="less" scoped>
    .el-row {
        margin-bottom: 20px;
        &:last-child {
            margin-bottom: 0;
        }
    }
</style>